import React, {Component} from "react";
import PropTypes from 'prop-types';
import {nanoid} from 'nanoid'

export default class Header extends Component{
    static propTypes = {
        addtodos:PropTypes.func.isRequired
    }
    handle = (event) =>{
        if (event.keyCode !== 13)
        {return}
        if (event.target.value.trim() === "")
        {
            alert("不能为空")
            return
        }
        console.log(event.target.value)
        const todoObj = {id:nanoid(),value:event.target.value,action:false}
        this.props.addtodos(todoObj)
    }

    render() {
        return(
            <div className="Header m-2">
                <input onKeyUp={this.handle} type="text" className="form-control" placeholder="请输入你的任务名称，按回车确认"/>
            </div>
        )
    }
}